<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title> 入库 </title>
  <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <link rel="stylesheet" href="css/mui.min.css">
  <link rel="stylesheet" href="css/icons-extra.css">
  <link rel="stylesheet" href="css/app.css">
  <script src="js/jquery.min.js"></script> 
  <script src="js/layer.js"></script> 
  <link rel="stylesheet" href="./css/guige.css">
  <script src="js/mui.min.js"></script>
  <script src="js/song.js"></script>
  <style type="text/css">
    #supplier-box ul {
      background: #fff
    }

    #supplier-box ul li {
      padding: 11px 13px;
    }

    #supplier-box ul li .mui-media-body {
      font-size: 12px;
    }

    /* .mui-input-row label{ text-align: right; } */

    .mui-input-row-textarea {
      height: initial !important
    }

    #mui-card-form .mui-card-footer {
      justify-content: flex-end;
    }

    #warehouse-click .mui-input-row {
      font-size: 13px; 
    }

    #warehouse-click .mui-input-row input {
      font-size: 12px; 
    }

    .mui-btn-block{ padding: 10px 0; }
    #guige-boxNumber{ height: 300px; }
  </style>


</head>

<body>
  <header id="header" class="mui-bar mui-bar-nav">
    <h1 class="mui-title">海外入仓</h1>
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <button class="mui-btn mui-btn-blue mui-btn-link mui-pull-right">保存</button>
    <!-- <a id="promptBtn" class="mui-icon mui-icon-search mui-pull-right"></a> -->
    <!-- <a class="mui-icon mui-icon-checkmarkempty mui-pull-right">   </a> -->
  </header>

  <div class="mui-content" id="supplier-search">

    <div class="mui-card">
      <div class="mui-card-header">
        新增海外入库单
      </div>

      <div class="mui-input-group mui-card-content">
        <div class="mui-input-row">
          <label>入仓单编号：</label>
          <input type="text"  disabled value="DY8888888"  >
        </div>

        <div class="mui-input-row">
          <label>入仓单类型：</label>
          <select>
            <option value="0">选择入仓类型</option>
            <option value="1">采购入库</option>
            <option value="2">销售退货入库</option> 
          </select>
        </div>
        <div class="mui-input-row">
          <label>关联运单号：</label>
          <select class="f00">
            <option value="0">点击选择海运运单号</option>
            <option value="DY66666666">DY66666666</option>
            <option value="DY66666666">DY66666666</option>
            <option value="DY66666666">DY66666666</option>
          </select>
        </div>

        <ul class="mui-table-view" id="warehouse-click">
          <li class="mui-table-view-cell mui-collapse">
            <a class="mui-navigate-right" href="#">点击查看订单详情</a>
            <div class="mui-collapse-content">
              <div class="mui-input-row">
                <label>制单人</label>
                <input type="text" placeholder="制单人">
              </div>
              <div class="mui-input-row">
                <label>供应商编号</label>
                <input type="text" class="mui-input-clear" placeholder="供应商编号">
              </div>
              <div class="mui-input-row">
                <label>供应商名称</label>
                <input type="text" class="mui-input-clear" placeholder="供应商编号">
              </div>
              <div class="mui-input-row">
                <label>供应商联系人</label>
                <input type="text" class="mui-input-clear" placeholder="供应商联系人">
              </div>
              <div class="mui-input-row">
                <label>供应商电话</label>
                <input type="text" class="mui-input-clear" placeholder="供应商电话">
              </div>
              <div class="mui-input-row">
                <label>制单时间</label>
                <input type="text" class="mui-input-clear" placeholder="制单时间">
              </div>
              <div class="mui-input-row mui-input-row-textarea">
                <label>备注</label>
                <textarea id="textarea" rows="2" placeholder=""></textarea>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>

    <form action="" class="mui-content-padded" style="margin: 10px;">
      <div class="mui-input-row mui-search" id=" ">
        <input type="search" class="mui-input-clear" placeholder="如：男鞋">
      </div>
    </form> 
    <div id=" ">
      <ul class="mui-table-view " id="">
        <li class="mui-table-view-cell mui-media"> 
            <span class="mui-badge mui-badge-danger warehouse-add">添加</span> 
            <div class="mui-media-body">
              <h4 class="title">商品货号编号</h4>
              <p class="mui-ellipsis"> 货品箱规格：
                <span> 货品箱规格 </span>
              </p>
              <p class="mui-ellipsis"> 总数量：
                <span>1000</span>&nbsp;&nbsp;&nbsp; 入库数量：
                <span class="input_nor_line">
                  <input class="input_nor" type="text" value="100">
                </span>
              </p>
              <p class="mui-ellipsis">
                选择仓库
                <span class="input_nor_line">
                    <select class="mui-input-clear input_nor">
                        <option value="A仓">A仓</option>
                        <option value="B仓">B仓</option>
                      </select>
                </span>
              </p>
            </div>  
        </li>
        <li class="mui-table-view-cell mui-media"> 
            <span class="mui-badge mui-badge-danger warehouse-add">添加</span> 
            <div class="mui-media-body">
              <h4 class="title">商品货号编号</h4>
              <p class="mui-ellipsis"> 货品箱规格：
                <span> 货品箱规格 </span>
              </p>
              <p class="mui-ellipsis"> 总数量：
                <span>1000</span>&nbsp;&nbsp;&nbsp; 入库数量：
                <span class="input_nor_line">
                  <input class="input_nor" type="text" value="100">
                </span>
              </p>
              <p class="mui-ellipsis">
                选择仓库
                <span class="input_nor_line">
                    <select class="mui-input-clear input_nor">
                        <option value="A仓">A仓</option>
                        <option value="B仓">B仓</option>
                      </select>
                </span>
              </p>
            </div>  
        </li>
      </ul>

    </div>


    <div class="mui-card">
 
      <div class="mui-card-header">
        确认入库信息
      </div>
      <div class="mui-card-content">
        <table class="table-style">
            <thead>
                <tr>
                    <th> 货品编号 </th>
                    <th> 货品箱 </th>
                    <th> 入库数量 </th>
                    <th> 仓库 </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td> s001 </td>
                    <td> ****** </td>
                    <td> 11 </td>
                    <td> 一仓 </td>
                </tr> 
                <tr>
                    <td> s001 </td>
                    <td> ****** </td>
                    <td> 11 </td>
                    <td> 一仓 </td>
                </tr> 
            </tbody>
        </table>
      </div>
      <div class="mui-card-footer">
          <div class="mui-button-row">
              <button type="button" class="mui-btn mui-btn-primary">提交保存</button>&nbsp;&nbsp; 
              <button type="button" class="mui-btn ">取消</button> 
          </div> 
        </div>
    </div>
  
  </div>


    <!-- 弹出层 -->
    <div id="guige-boxNumber" style="display:none">
        <div class="title"> 退货理由 </div> 
        <form class="mui-input-group">
       
            <div style="padding-top: 10px"> 
              <div id="up-img-box">
                  <button class="mui-btn-primary">选择图片上传</button>
                  <input type="file" name="file" id="doc" multiple="multiple"   onchange="javascript:setImagePreviews();buttonImg();"
                    accept="image/*" />
                  <div id="dd"></div>
                </div>
            </div>
            <div class="mui-input-row mui-input-row-textarea">
              <label>描述</label>
              <textarea name="" class="mui-input-clear" id="" rows="4" placeholder="图片描述" ></textarea> 
            </div> 
          </form>
        <button type="button" class="mui-btn mui-btn-primary mui-btn-block" id=""> 确认添加 </button>
    </div>

    <div class="jxc-mask"></div>
 


  <script src="./js/up-img.js"></script>
  <script type="text/javascript"> 
   function buttonImg(){  if($("#dd").html() !==""){ $("#up-img-box button").hide(); $("#guige-boxNumber").css({  "height": "420px"  }); }   }  
        //  展开选择框
        $("#tuihuo").on("click", function () {
            showBOX()
        }) 
        //  隐藏选择框
        $(".jxc-mask").on("click", function () {
            hideBOX()
        })
  </script>

  <nav class="mui-bar mui-bar-tab" id="bar-down">

    <div class="mui-tab-item mui-active" data-href="./index.html">
      <span class="mui-icon mui-icon-home"></span>
      <span class="mui-tab-label">首页</span>
    </div>
    <div class="mui-tab-item" data-href="./sales.html">
      <span class="mui-icon mui-icon-star"> </span>
      <span class="mui-tab-label">销售管理</span>
    </div>
    <div class="mui-tab-item" data-href="./procurement.html">
      <span class="mui-icon mui-icon-download"> </span>
      <span class="mui-tab-label">采购管理</span>
    </div>
    <div class="mui-tab-item" data-href="./warehouse.html">
      <span class="mui-icon mui-icon-flag"></span>
      <span class="mui-tab-label">仓库管理</span>
    </div>
    <div class="mui-tab-item" data-href="./basis.html">
      <span class="mui-icon mui-icon-gear"></span>
      <span class="mui-tab-label">基础管理</span>
    </div>
  </nav>


  <script>
    mui.init({});

    // 底部导航 链接
    mui("#bar-down").on("tap", "div", function () {
      var href = this.getAttribute("data-href");
      if (href !== "") {
        gotoUrl(href);
        return;
      }
    }, false);
  </script>
</body>

</html>